@extends('admin.layout.base')
@section('content')
    <div class="panel-content" id="app" v-cloak>
        <div class="panel-body panel-info">
            <el-form :model="form" ref="form" class="form" label-width="100px">
                <div class="panel-header"> <div class="panel-title"> 订单信息 </div> </div>
                <div class="panel-main">
                    <el-form-item label="订单号：" prop="order_sn">
                        <el-input clearable v-model="form.order_sn" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="退款单号：" prop="refund_sn">
                        <el-input clearable v-model="form.refund_sn" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="买家：" prop="user_name">
                        <el-input clearable v-model="form.user_name" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="商铺：" prop="store_name">
                        <el-input clearable v-model="form.store_name" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="退款金额：" prop="amount">
                        <el-input clearable v-model="form.amount" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="退款数量：" prop="number">
                        <el-input clearable v-model="form.number" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="申请原因：" prop="user_message">
                        <el-input clearable v-model="form.user_message" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="凭证图片：" prop="user_pic">
                        <el-input clearable v-model="form.user_pic" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="类型：" prop="type">
                        <el-input clearable v-model="form.type" readonly="readonly"></el-input>
                    </el-form-item>
                    <el-form-item label="状态：" prop="state">
                        <el-input clearable v-model="form.state" readonly="readonly"></el-input>
                    </el-form-item>
                </div>

                <div v-if="form.state != '审核中'">
                    <div class="panel-header"> <div class="panel-title"> 审核信息 </div> </div>
                    <div class="panel-main">
                        <el-form-item label="审核时间：" prop="seller_time">
                            <el-input clearable v-model="form.seller_time" readonly="readonly"></el-input>
                        </el-form-item>
                        <el-form-item label="审核内容：" prop="seller_message">
                            <el-input clearable v-model="form.seller_message" readonly="readonly"></el-input>
                        </el-form-item>
                    </div>
                </div>

                <el-form-item style="padding-left: 150px;margin-top: 50px">
                    <el-button @click="back()" style="margin-left: 50px">返 回</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
@endsection
@section('scripts')
    <script src="{{ asset('neditor/neditor.config.js') }}" type="text/javascript"></script>
    <script src="{{ asset('neditor/neditor.all.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('neditor/neditor.service.js') }}" type="text/javascript"></script>
    <script src="{{ asset('neditor/i18n/zh-cn/zh-cn.js') }}" type="text/javascript"></script>
    <script src="{{ asset('neditor/third-party/browser-md5-file.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('neditor/third-party/jquery-1.10.2.min.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/moment.min.js') }}" type="text/javascript"></script>
    <script>
        $(function () {
            let app = new Vue({
                el: '#app',
                data: function () {
                    return {
                        info: {!! $info !!},
                        form: {
                            id: " {{ $id }}",
                            order_sn: '',
                            refund_sn: '',
                            user_name: '',
                            store_name: '',
                            amount: 0.00,
                            number: 0,
                            user_message: '',
                            user_pic: '',
                            type: 0,
                            state: 0,
                            seller_time: '',
                            seller_message: '',
                            track_sn: '',
                        },
                    }
                },
                created() {
                    let that = this;
                    if (this.form.id > 0) {
                        this.form = {
                            id: this.info.id,
                            order_sn: this.info.order_sn,
                            refund_sn: this.info.refund_sn,
                            user_name: this.info.user_name,
                            store_name: this.info.store_name,
                            amount: this.info.amount,
                            number: this.info.number,
                            user_message: this.info.user_message,
                            user_pic: this.info.user_pic,
                            type: this.info.type,
                            state: this.info.state,
                            seller_time: this.info.seller_time,
                            seller_message: this.info.seller_message,
                            track_sn: this.info.track_sn,
                        };
                    }
                },
                methods: {
                    //返回
                    back() {
                        window.history.go(-1);
                    },
                }
            });
        })
    </script>
@endsection
